<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-3.3.1.min.js" type="text/javascript"></script>
<script src="js/cate.js" type="text/javascript"></script>
<script src="js/question.js" type="text/javascript"></script>
<script src="js/login.js" type="text/javascript"></script>
<script src="js/answer.js" type="text/javascript"></script>
<script src="js/mode.js" type="text/javascript"></script>
<style type="text/css">

.part{
  position: relative;
}
.top{
    /* 设置宽度高度背景颜色 */
    height: 50px; /*高度改为自动高度*/
    width:100%;
    margin-left: 0;
    background:white	;
    position: relative;; 
    top: 0;/*离顶部的距离为0*/
    margin-bottom: 5px;
    text-align:center;
    padding:0px;
 	margin:0px;
 	border:0px;
   line-height:50px;
}
.topElement{
  text-align:left;
  /* padding-top:15px; */
  height:50px;
}
/* *{
 	padding:0px;
 	margin:0px;
 	border:0px;
 } */
body{
  /* background:blue; */
     margin:0px;
     background:#f0f0f0;
     font-size:14px;
     /* font-family:"微软雅黑"; */
}
#titleArea{
  width:95%;
}
#detailArea{
  width:95%;
  /* margin:1%; */
}
#contentArea{
  width:95%;
}
#aidArea{
  width:95%;
}
textarea{
  background-color:#fafafa;
}
button{
  background:  #008CBA;
  border-radius: 4px;
  border: 2px solid white;
  font-size:15px;
  color:white;

}
.topElement p{
margin:0 auto;

}
p{
  word-wrap: break-word;
  word-break: break-all;
  overflow: hidden;
}

</style>
<!--检查登录状态-->
<script>
checkLogin();
</script>
<link rel="icon" href="pic/logo.ico" type="image/x-icon"/>
<title>主页</title>
</head>
<body>
<!--存放个人的数据-->
<div class="top">
<div id="myIndex" style="width:25%  ;float: left;left:20px">
  <div class="part">  
    <div style="position: absolute;left:10px;width:50px ;height:50px;text-align:center;">
      <img src="pic/user1.png" width=50px height=50px >
    </div>
    <div style="float:left">
      <div id="myUid" class="topElement" style="border-right:1px solid  #f0f0f0;width:150px;left:140px;position:absolute;"></div>
      <div id="myUsername" class="topElement" style="border-right:1px solid  #f0f0f0;width:300px;left:290px;position: absolute;"></div> 
      <div id="myDescription" class="topElement" style="width:300px;left:590px;position: absolute;"></div>                        
    </div>
      </div> 
   </div> 
  <!--存放类别（课程种类）的数据-->
  <!-- <div id="cate" style="border:0px solid  #000; left:500px position: absolute;">课程类别</div> -->
 </div>

  <!--存放类别（课程种类）的数据-->
<div id="cate" style="padding-top:5px;margin-left:8px;margin-top:8px;margin-right:3px; width:8%;height:820px;float:left;background-color:#fff;font-size:13px;text-align:center;">
课程种类</div>

<!--存放某个类别下的所有问题的数据-->
<div id="allQuestion"  style="margin-left:4px;margin-top:8px;margin-right:3px; width:45% ;height:100% ; float: left;">
    <div id=“addQuestion” style="height:200px ;margin-bottom:3px;background-color:#fff;padding:10px;padding-top:2px">
      <p id="localCate" style="font-size:14px;border-bottom:1px solid  #f0f0f0; padding-bottom:4px ">当前选择的课程：未选择</p>
      <p style="font-size:14px;">添加问题</p>
      <textarea id="titleArea" rows="1" cols="20">请输入标题</textarea>
      <textarea id="detailArea" rows="3" cols="20">请输入内容</textarea>
      <button class="button1" id="questionButton" onclick="addOneQuestion()" style="position: relative; left:88% ;cursor:pointer;cursor:hand">提交</button>
    </div>
    <div id="question" style="margin-top:1px;height:100%;background-color:#fff;padding:10px;padding-top:2px">
     <p style="font-size:14px">所有问题：</p>
     <p style="font-size:14px">请选择一个问题类别</p>
    </div>
</div>

<div id="allAnswer" style="margin-left:3px;margin-top:8px; width:45% ;height:100% ; float: left">
    <div id="addAnswer"style="height:200px;margin-bottom:3px;background-color:#fff;padding:10px;padding-top:2px;">
     <div style="border-bottom:1px solid  #f0f0f0;padding-bottom:10px" >
      <p id="localQustion" style="font-size:14px;float:left;">当前选择的问题：未选择</p>
     <button onclick="insertMode()" class="button1"  style="left:10px; top:8px; position:relative;">添加回答</button>
     <button onclick="updateMode()" class="button1" style="left:10px; top:8px; position:relative;">修改回答</button>
     <button onclick="deleteMode()" class="button1" style="left:10px; top:8px; position:relative;">删除回答</button>
     
     </div> 
      <!-- <p style="font-size:14px">添加/修改回答</p> -->
      <textarea id="aidArea" rows="1" cols="10" style="display:inline;">请输入答案id</textarea>
      <textarea id="contentArea" rows="5" cols="20" style="display:inline;">请输入内容</textarea>
      <button id="answerButton" class="button1"  onclick="addOneAnswer()" style="display:inline;position: relative; left:88% ;cursor:pointer;cursor:hand">添加</button>
      <button id="answerButton2" class="button1"  onclick="updateOneAnswer()" style="display:none;position: relative; left:88% ;cursor:pointer;cursor:hand">修改</button>
      <button id="answerButton3" class="button1"  onclick="deleteOneAnswer()" style="display:none;position: relative; left:88% ;cursor:pointer;cursor:hand">删除</button>
    
    </div>
    <div id="answer" style="margin-top:1px;height:100%;background-color:#fff;padding:10px;padding-top:2px">
     <p style="font-size:14px">所有答案：</p>
     <p style="font-size:14px">请选择一个问题</p>
    </div>
</div>
<script>
loadCategory();
</script>

</body>
</html>